<template>
	<view>
		<view id="app">
			<view>
				<view class="wrap_all">
					<view class="wrap_top">
						<img src="../../static/5dd26ca16d406.jpg" class="logo">
						<view>
							<view class="title1">72小时CP--1335</view>
							<view class="font_pink">利用259200秒谈一场恋爱</view>
						</view>
						<view class="kefu" @click="showKefu()">联系客服</view>
					</view>
					<view class="mint-swipe swipe">
						<view class="mint-swipe-items-wrap">
							<view class="mint-swipe-item swipe_haibao is-active">
								<img src="../../static//2019-6e8ab36c-f76f-44b4-9045-ad0e99fc36ec.png" class="swiper_img">
							</view>
						</view>
						<view class="mint-swipe-indicators" style="display: none;">
							<view class="mint-swipe-indicator is-active"></view>
						</view>
					</view>
					<view class="tip2">第 {{activeNum}} 期</view>
					<view class="join_btn">报名参加</view>
					<view class="wrap_2btn">
						<view class="history">
							<img src=""
							 class="history_icon">
							<view>匹配历史</view>
							<view></view>
						</view>
						<view class="my_cp"><img src=""
							 class="my_cp_icon">
							<view>我的CP</view>
						</view>
					</view>
					<view class="reduce">
						<view class="reduce_icon"></view>
						<view class="reduce_icon"></view>
						<view class="reduce_text">活动介绍</view>
					</view> <img src="../../static//2019-b6683de1-f4ac-4715-af58-ec30ecfcf7b7.png" class="bottom_img">
					<view class="join_btn">报名参加</view>
					<!-- 显示联系客服二维码 -->
					<view  class="outmask" v-if="isShowKefu" @tap="closeKefu()">
						<view  class="mint-popup code_mask" style="top: 300px; z-index: 2001;" @tap="showKefu2()">
							<view>
								<view class="font1">长按以下二维码</view>
								<view class="font1" style="display:inline">联系</view>
								<view class="font2" style="display:inline">可爱客服小姐姐</view>
								<img  src="https://i.loli.net/2019/11/25/BIHJ64DoSlUjC9F.jpg" class="code_img">
								<view class="font3">请记住您的UID：34534543</view>
								<view class="font4">将您的uid提供给客服</view>
							</view>
						</view>
						<view class="v-modal" style="z-index: 2000;"></view>
					</view>
					<!-- 显示匹配查询二维码 -->
					<view class="outmask2" style="display: none;">
						<view class="wrap_code">
							<view class="tips2">恭喜你报名成功,匹配状态查询步骤如下</view>
							<view class="tip_gray">（每周四下午18点推出匹配结果）</view>
							<view class="tips4">
								1：
								<span class="font_pink2">长按识别二维码</span>进入服务号
							</view>
							<view class="tips4">
								2：点击菜单栏
								<span class="font_pink2">"72小时CP"</span></view>
							<view class="tips4">
								3：选择上拉菜单中的
								<span class="font_pink2">" 匹配查询 "</span></view> <img src="https://newadmin.yidaxue.com/uploads/api/20191118/5dd26f9a5d763.jpg"
							 class="code_img">
						</view>
					</view>
				</view>
			</view>

		</view>
		<div class="mint-indicator" style="display: none;">
			<div class="mint-indicator-wrapper" style="padding: 20px;"><span class="mint-indicator-spin">
					<div class="mint-spinner-snake" style="border-top-color: rgb(204, 204, 204); border-left-color: rgb(204, 204, 204); border-bottom-color: rgb(204, 204, 204); height: 32px; width: 32px;"></div>
				</span> <span class="mint-indicator-text" style="">加载中...</span>
			</div>
			<div class="mint-indicator-mask"></div>
		</div>
	</view>

</template>

<script>
	import wxAuthorize from '@/common/util.js'
	export default {
		data() {
			return {
				activeNum:100,
				code:null,
				state:null,
				isShowKefu:false,
				fromKefu:false
			}
		},
		onLoad(option){ //option为object类型，会序列化上个页面传递的参数
		    console.log(option.code); //打印出上个页面传递的参数。
		    console.log(option.state); //打印出上个页面传递的参数。
			this.code=option.code;
			this.state=option.state;
		},
		methods: {
		
			showKefu(){
				this.isShowKefu=true;
			},
			showKefu2(){
				this.fromKefu=true;
			},
			closeKefu(){
				if(this.fromKefu){
					this.fromKefu=false;
				}else{
					this.isShowKefu=false;
				}
			}
		},
		onShow() {
			document.title = "72小时cp恋爱报名活动";
			let appid = 'wx87161e16c8048de0';
			let secret='ba5c97a880705803c90b8f56018e95a1';
			let uri = encodeURIComponent('http://192.168.1.94/h5/pages/index/index');
			
			console.log(this.code);
			if(this.code){
				// let access_tokenURL='https://api.weixin.qq.com/sns/oauth2/access_token?appid=${appid}&secret=${secret}&code=${this.code}&grant_type=authorization_code';
				// window.location.href = access_tokenURL;
				uni.request({
				    url: 'http://192.168.1.94:8081/wx/weixinLogin', 
				    data: {
						code:this.code,
						state:this.state
				    },
				    success: (res) => {
				        console.log(res);
				    }
				});
			}else{
				let authURL = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${uri}&response_type=code&scope=snsapi_userinfo&state=123#wechat_redirect`;
				window.location.href = authURL;
			}
		},
		// 在App.vue中的启动方法中，去开启授权
		onLaunch: function() {

		}
	}
</script>

<style>
@import "../../allUI/index.css";
</style>
